/**
 * 需求: 封装一个组件
 * 名字: Button
 * 使用示例: <Button type="primary">提交</Button>
 * 属性:
 *  * type 类型 可以设置的值有  primary  蓝色  danger 红色
 *  * disabled  可以设置为 true 或 false   该按钮是否可点
 *  * loading   设置是否处于一个加载中的状态  true 或 false
 */
import React from "react";
import "./03_Button.css";
//导入 gif 图
import gif from "./loading.gif";

export default class Button extends React.Component {
  render() {
    //输出 props 属性
    //获取 type 属性
    let { type, children, disabled, loading } = this.props;
    return (
        <button className={`${type} ${disabled ? "disabled" : ""}`}>
          {loading ? <img width="12" src={gif} /> : null}
          {children}
        </button>
    );
  }
}
